<x-shuguo-layout>
    <x-slot name="header">
        <form class="layui-form">
            <blockquote class="layui-elem-quote quoteBox">
                <form class="layui-form">
                    <div class="layui-inline">
                        <div class="layui-input-inline">
                            <input type="text" class="layui-input searchVal" placeholder="请输入搜索的内容" />
                        </div>
                        <a class="layui-btn search_btn" data-type="reload">搜索</a>
                    </div>
                </form>
            </blockquote>
            <table id="list" lay-filter="list"></table>
            <!--操作-->
            <script type="text/html" id="listBar">

                <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="del">删除</a>
            </script>
        </form>

        <script type="text/javascript">

            layui.use(['form','layer','laydate','table','laytpl'],function(){
                var form = layui.form,
                    layer = parent.layer === undefined ? layui.layer : top.layer,
                    $ = layui.jquery,
                    laydate = layui.laydate,
                    laytpl = layui.laytpl,
                    table = layui.table;

                //列表
                var tableIns = table.render({
                    elem: '#list',
                    url : '/liuyan/doLists',
                    cellMinWidth : 95,
                    page : true,
                    height : "full-125",
                    limit : 20,
                    limits : [10,15,20,25],
                    id : "list",
                    cols : [[
                        {field: 'id', title: 'ID', width:80, align:"center"},
                        {field: 'createtime', title: '留言时间', align:'center',width:150, },
                        {field: 'username', title: '姓名',width:150,  align:'center'},
                        {field: 'phone', title: '电话',width:150,align:"center" },
                        {field: 'content', title: '留言内容',align:"center" },
                        {title: '操作',
                            templet:'#listBar',fixed:"right",align:"center"}
                    ]]
                });
                //搜索【此功能需要后台配合，所以暂时没有动态效果演示】
                $(".search_btn").on("click",function(){
                    table.reload("list",{
                        page: {
                            curr: 1 //重新从第 1 页开始
                        },
                        where: {
                            key: $(".searchVal").val()  //搜索的关键字
                        }
                    })
                });

                //添加
                function add(){
                    var index = layui.layer.open({
                        title : "添加用户",
                        type : 2,
                        content : "add",
                        area:['500px','100%'],
                        success : function(layero, index){
                            var body = layui.layer.getChildFrame('body', index);
                            setTimeout(function(){
                                layui.layer.tips('点击此处返回用户列表', '.layui-layer-setwin .layui-layer-close', {
                                    tips: 3
                                });
                            },500)
                        }
                    })
                    layui.layer.full(index);
                    //改变窗口大小时，重置弹窗的宽高，防止超出可视区域（如F12调出debug的操作）
                    $(window).on("resize",function(){
                        layui.layer.full(index);
                    })
                }

                //修改
                function update(id){
                    var index = layui.layer.open({
                        title : "修改用户",
                        type : 2,
                        content : "update?id="+id,
                        area:['500px','100%'],
                        success : function(layero, index){
                            var body = layui.layer.getChildFrame('body', index);
                            setTimeout(function(){
                                layui.layer.tips('点击此处返回用户列表', '.layui-layer-setwin .layui-layer-close', {
                                    tips: 3
                                });
                            },500)
                        }
                    })

                    layui.layer.full(index);
                    //改变窗口大小时，重置弹窗的宽高，防止超出可视区域（如F12调出debug的操作）
                    $(window).on("resize",function(){
                        layui.layer.full(index);
                    })
                }

                $(".add_btn").click(function(){
                    add();
                })
                //列表操作
                table.on('tool(list)', function(obj){
                    var layEvent = obj.event,
                        data = obj.data;

                    if(layEvent === 'edit'){ //编辑
                        update(data.id);
                    }else if(layEvent === 'del'){ //删除
                        layer.confirm('确定删除吗？',{icon:3, title:'提示信息'},function(index){
                            $.post("/liuyan/del",{ids : data.id,status:2},function(_obj){
                                var data = eval('(' + _obj + ')')
                                if(data.code == AdminConstant.code_success){
                                    layer.alert(data.msg)
                                    tableIns.reload();
                                }else{
                                    layer.alert(data.msg)
                                }
                                layer.close(index);
                            })
                        });
                    }else if(layEvent === 'del_open'){ //
                        layer.confirm('确定上架吗？',{icon:3, title:'提示信息'},function(index){
                            $.post("/goods/status",{id : data.id,status:1},function(_obj){
                                var data = eval('(' + _obj + ')')
                                if(data.code == AdminConstant.code_success){
                                    layer.alert(data.msg)
                                    tableIns.reload();
                                }else{
                                    layer.alert(data.msg)
                                }
                                layer.close(index);
                            })
                        });
                    }else if(layEvent === 'look'){ //预览
                        layer.alert("暂不支持")
                    }
                });

            })

        </script>



    </x-slot>

</x-shuguo-layout>